@import '../Shared/_variables.scss';

.contextual-links {
  margin: 12px 16px;
  border-top: 5px solid $postman-orange;
  
  .contextual-links__section {
    margin-top: 24px;
    margin-bottom: 8px;
    font-size: 16px;
    font-weight: 600;
    color: $gray-3;
  }
  .contextual-links__link {
    margin-bottom: 12px;
  }

  .contextual-links__subtitle {
    color: $gray-2;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
  }

  a {
    color: $postman-orange;
    font-size: 14px;
    text-decoration: none;
    &:hover {
      color: $gray-3;
    }
  }

  // tablet view
  @media (min-width: 767px) and (max-width: 990px) {
      padding-bottom: 80px;
      margin-left: 32px;
  }


  // mobile view
  @media (max-width: 767px) {
    padding-bottom: 80px;
  }
}